<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>基本选择器</title>
    <!--
        基本选择器共有四种
        id选择器
            使用id选择器时通过#id值进行匹配
            id属性值不能重复,只能匹配一个元素
        class选择器
            使用class选择器时通过.class值进行匹配
            可以匹配多个元素
        标签选择器
            使用标签选择器时直接写标签名即可
            可以匹配多个元素
        *选择器
            匹配一切
        基本选择器优先级问题
            id选择器>class选择器>标签选择器>*选择器
    -->
    <style>
        #p1{
            color:red;
        }
        .c1{
            color:green;
        }
        div{
            color:blue;
        }
        *{
            color:pink;
        }
    </style>
</head>
<body>
<p id="p1">第1个段落</p>
<p class="c1">第2个段落</p>
<p class="c1">第3个段落</p>
<p class="c1">第4个段落</p>
<p>第5个段落</p>
<div class="c1">第1个div</div>
<div class="c1">第2个div</div>
<div>第3个div</div>
<div>第4个div</div>
<div>第5个div</div>
</body>
</html>